<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html style='height:100%;'>
<head>
<base href="<%=basePath%>">

<title>宠物管理</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<link rel="stylesheet" href="css/vivo.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="js/bootstrap2/css/bootstrap.min.css">
<link rel="stylesheet" href="js/bootstrap2/css/bootstrap-table.css">
<link rel="stylesheet" href="css/common.css">
<link rel="stylesheet" href="js/font-awesome/css/font-awesome.css">
<link href="js/select2/select2.min.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" type="text/css"
	href="static/p_house/house_index.css" />
<link rel="stylesheet" type="text/css"
	href="js/webuploader-0.1.5/webuploader.css" />

<script src="js/jquery-1.11.1.js"></script>
<script src="js/bootstrap2/js/bootstrap.min.js"></script>
<script src="js/bootstrap2/js/bootstrap-table.js"></script>
<script src="js/bootstrap2/js/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript" src="js/layui-v2.1.5/layui/layui.all.js"></script>
<script type="text/javascript"
	src="<%=basePath%>js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="js/webuploader-0.1.5/webuploader.js"></script>
<script type="text/javascript" src="js/sharefunction.js"></script>
<script type="text/javascript" src="js/form.js"></script>
<script src="js/select2/select2.min.js"></script>
<!-- 图片放大 -->
<script src="js/postbird-img-glass/postbird-img-glass.js"></script>
<style>
/* 控制删除按钮的样式 */
span.uploadcancel {
	width: 20px;
	height: 17px;
	display: inline-block;
	background: url(images/icons.png) no-repeat;
	background-position: -48px 0px;
	cursor: pointer;
}

th {
	color: white;
	background-color: #F08080
}

.table-striped tbody>tr:nth-child(odd)>td {
	background-color: #EDEDED;
}

.table th, .table td {
	text-align: center;
	vertical-align: middle !important;
}

.bootstrap-table {
	width: 100%
}

.pagination>.active>a {
	border-color: #ddd;
}
</style>
</head>

<body style='height:100%'>
	<!-- 宠物管理 -->
	<div style="padding:0 10px">
		<a class="btn btn-danger" onClick='openAddPet()' id="addPetButton" hidden="hidden">新增</a>
		<!-- 列表start -->
		<div style="padding-top: 5px;" class="changeTable">
			<table id="table" style="table-layout:fixed">

			</table>
		</div>
		<!-- 列表end -->
		<!-- 表单start -->

		<div id="topetAdd" hidden="hidden"
			style="margin-top: 15px;height:445px">
			<iframe id="toAddPet" name="toAddPet" width="100%"
				style="height:100%;" frameborder="0"></iframe>
		</div>
		<!-- 表单end -->
		<!-- 隐藏域 -->
		<div style="display: none">
			<input name="petId" id="petId">
		</div>
		<div style="padding-top: 5px">
			<!-- 信用信息更改字段列表 -->
			<table id="petChageTable"></table>
		</div>
	</div>
	<script type="text/javascript">
	var historyStatus=parent.$("#historyStatus").val();//客户是否历史状态
		function openAddPet() {
			$("#topetAdd").show();
			var id = $("#petId").val();
			$("iframe[id='toAddPet']").attr("src", "customer/pet/toAddPet");
		}
	
		var fkcustomerId;
		var fkroomId;
		//表格-操作 - 格式化 
		function actionFormatter(value, row, index) {
			var history = parent.$("#history").val();
			var html="<a class='btn btn-info' onClick='showPet(\"" + row.id + "\")'>查看</a>";
			if(history != 'yes'){
				<shiro:hasPermission name="permission:edit"> 
					if(historyStatus==0){
						html +="&nbsp;&nbsp;<a class='btn btn-info' onClick='editPet(\"" + row.id + "\")'>修正</a>";
					}
				</shiro:hasPermission> 
				<shiro:hasPermission name="permission:delete"> 
					if(historyStatus==0){
						html +="&nbsp;&nbsp;<a class='btn btn-warning' onClick='delPet(\"" + row.id + "\")'>删除</a>";
					}
				</shiro:hasPermission>  
			}
			return html;
		
		}
		function editPet(id) {
			$("#topetAdd").show();
			$("iframe[id='toAddPet']").attr("src", "customer/pet/toAddPet?id=" + id +"&petFlag=2");
		}
		function showPet(id) {
			$("#topetAdd").show();
			$("iframe[id='toAddPet']").attr("src", "customer/pet/toAddPet?id=" + id +"&petFlag=1");
		}
		function delPet(id) {
			layer.confirm('确定删除该条信息吗？', {
				btn : [ '确定', '取消' ] //按钮
			}, function() {
				//点击确定时，删除该条数据
				$.ajax({
					url : "customer/pet/delpet", //请求的url地址
					async : true, //请求是否异步，默认为异步
					data : {
						"id" : id
					}, //参数值
					type : "GET", //请求方式
	
					success : function(req) {
						if (req.success) {
							layer.msg("删除成功", {
								anim : 5,
								time : 1500
							}, function() {
								location.reload();
							});
	
						}
					}
				});
			}, function() {
				layer.close();
			});
		}
		//日期格式化
		function dataFormat(value, row, index) {
			return new Date(row.createDate).format("yyyy-MM-dd");
		}
			
		$(function() {
			var history = parent.$("#history").val();
			if(history == 'yes'){
				$("#addPetButton").remove();
			}
			if(historyStatus==0){
				$("#addPetButton").show();
			}else{
				$("#addPetButton").hide();
			}
			fkcustomerId = parent.$("#customerId").val();
			fkroomId = parent.$("#roomId").val();
			//先销毁表格  
			//$('#table').bootstrapTable('destroy');  
			//初始化表格,动态从服务器加载数据  
			$("#table").bootstrapTable({
				method : "post", //使用get请求到服务器获取数据  
				url : "customer/pet/getPetList", //获取数据的Servlet地址  
				striped : true, //表格显示条纹  
				pagination : true, //启动分页  
				pageSize : 2, //每页显示的记录数  
				pageNumber : 1, //当前第几页  
				pageList : [ 5, 10, 15, 20, 25 ], //记录数可选列表  
				sidePagination : "server", //表示服务端请求  
				contentType : 'application/x-www-form-urlencoded',
				//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder  
				//设置为limit可以获取limit, offset, search, sort, order  
				queryParamsType : "undefined",
				queryParams : function queryParams(params) { //设置查询参数  
					var param = {
						pageNumber : params.pageNumber,
						pageSize : params.pageSize,
						fkcustomerId : fkcustomerId
						//fkroomId : fkroomId
					};
					return param;
				},
				columns : [ {
					field : 'petName',
					title : '宠物名称',
				}, {
					field : 'petColor',
					title : '宠物颜色',
				}, {
					field : 'petType',
					title : '宠物类型',
				}, {
					field : 'registerCertificate',
					title : '登记证',
				//align : "left"
				}, {
					field : 'healthCertificate',
					title : '健康免疫证',
				//align : "left"
				}, {
					field : 'opr',
					title : '操作',
					width : '15%',
					formatter : 'actionFormatter'
				} ]
			});
		//初始化表格,动态从服务器加载数据  
			 $("#petChageTable").bootstrapTable({
				method : "post", //使用get请求到服务器获取数据  
				url : "customer/pet/getPetChangeList", //获取数据的Servlet地址  
				striped : true, //表格显示条纹  
				pagination : true, //启动分页  
				pageSize : 2, //每页显示的记录数  
				pageNumber : 1, //当前第几页  
				pageList : [ 5, 10, 15, 20, 25 ], //记录数可选列表  
				sidePagination : "server", //表示服务端请求  
				contentType : 'application/x-www-form-urlencoded',
				//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder  
				//设置为limit可以获取limit, offset, search, sort, order  
				queryParamsType : "undefined",
				queryParams : function queryParams(params) { //设置查询参数  
					var param = {
						pageNumber : params.pageNumber,
						pageSize : params.pageSize,
						fkcustomerId : fkcustomerId,
						fkroomId : fkroomId
					};
					return param;
				},
				columns : [ {
					field : 'createtime',
					title : '修改时间',
					width : '14%',
					formatter:petDataFormat
				}, {
					field : 'fieldname',
					title : '修改字段',
					width : '8%'
				}, {
					field : 'changebefore',
					title : '修改前数据',
					width : '25%',
					formatter:showText	
				}, {
					field : 'changeafter',
					title : '修改后数据',
					width : '25%',
					formatter:showText	
				}, {
					field : 'adduser',
					title : '修改人',
					width : '7%',
				}, {
					field : 'remarks',
					title : '变更说明',
					width : '21%',
					formatter:showText	
				} ]
			}); 
		});
		//日期格式化
		function petDataFormat(value, row, index) {
			return new Date(row.createtime).format("yyyy-MM-dd hh:mm:ss");
		}
		
	</script>
</body>
</html>
